<template>
    <div>
        <m-filter placeholder="请输入用户名称" search-key="">
            <a-button class="ml20" icon="plus" type="primary" @click="openModal()" v-has="'add'"></a-button>
            <!--            <template slot="search-form">-->
            <!--                <a-form-model layout="inline" class="index-search-form-model">-->
            <!--                    <a-form-model-item>-->
            <!--                        <a-input-->
            <!--                            placeholder="搜索自评名称"-->
            <!--                            @change="searchTable"-->
            <!--                            v-model="searchParams.name"-->
            <!--                            allowClear-->
            <!--                        />-->
            <!--                    </a-form-model-item>-->
            <!--                    <a-form-model-item>-->
            <!--                        <el-date-picker-->
            <!--                            size="small"-->
            <!--                            @change="searchTable"-->
            <!--                            v-model="searchParams.applyYear"-->
            <!--                            placeholder="选择自评年度"-->
            <!--                            type="year"-->
            <!--                            value-format="yyyy"-->
            <!--                        ></el-date-picker>-->
            <!--                    </a-form-model-item>-->
            <!--                    <a-form-model-item>-->
            <!--                        <a-button class="ml20" icon="redo" type="primary" @click="reset">重置</a-button>-->
            <!--                    </a-form-model-item>-->
            <!--                </a-form-model>-->
            <!--            </template>-->
        </m-filter>
        <div class="table">
            <a-table
                rowKey="id"
                :columns="columns"
                :data-source="tableData"
                :loading="tableLoading"
                :pagination="pagination"
                :scroll="{ y: true }"
                @change="handleTableChange"
            >
                <template slot="operate" slot-scope="text, record">
                    <template v-if="record.ifEdit">
                        <!--                        <span class="primary-color" @click="openModal(record)" v-has="'edit'"></span>-->
                        <!--                        <a-divider type="vertical" v-has="'edit:line'" />-->
                        <span class="primary-color" @click="goToDetails(record, true)" v-has="'verify'"></span>
                        <a-divider type="vertical" v-has="'del:line'" />

                        <a-popconfirm title="确定删除吗?" ok-text="是" cancel-text="否" @confirm="del(record.id)">
                            <span class="danger-color" v-has="'del'"></span>
                        </a-popconfirm>
                    </template>
                    <template v-else>
                        <span class="primary-color" @click="goToDetails(record, false)">查看</span>
                    </template>
                </template>
            </a-table>
        </div>
        <modal
            v-if="isShowModal"
            :currRow="currRow"
            :templateList="templateList"
            :isShowModal.sync="isShowModal"
            :roleList="roleList"
            :treeSelectedAreaId="currSelectedTreeNode[0]"
            @updateData="getTableData"
        />
    </div>
</template>

<script>
import modal from './modal'
import moment from 'moment'
import { PAGINATION } from '../../../common/config'
import { getFinalPageNum, getItemById } from '@/utils/methods'
import { selfEvaluationApi } from '../../../common/api/selfEvaluation'
import { constant } from '@/common/config'
import { selfEvaluationTemplate } from '@/common/api/setting'
import { selfEvaluationTemplateRestApi } from '../../../common/api/setting'

const { ENTERPRISE } = constant

export default {
    components: {
        modal,
    },
    data() {
        return {
            getItemById,
            // modal
            isShowModal: false,
            currSelectedTreeNode: [],
            // search
            roleList: [],
            searchParams: {
                applyYear: undefined,
                evaluationDate: undefined,
                name: '',
            },
            // table
            currRow: undefined,
            pagination: PAGINATION(),
            tableData: [],
            columns: [
                {
                    title: '自评名称',
                    dataIndex: 'name',
                },
                {
                    title: '自评时间',
                    dataIndex: 'evaluationDate',
                    customRender: text => {
                        return moment(text).format('yyyy-MM-dd')
                    },
                },
                {
                    title: '评分标准',
                    dataIndex: 'applyYear',
                },
                {
                    title: '自评得分（加权）',
                    dataIndex: 'zpScore',
                    customRender: text => {
                        return text ? text.toFixed(2) : 0
                    },
                },
                {
                    title: '操作',
                    dataIndex: 'operate',
                    scopedSlots: { customRender: 'operate' },
                    width: 250,
                },
            ],
            tableLoading: false,
            templateList: [],
        }
    },
    watch: {},
    mounted() {
        this.getTableData()
        this.getTemplateList()
    },
    methods: {
        async getTemplateList() {
            try {
                let res = await selfEvaluationTemplateRestApi.all()
                this.templateList = res.data
            } catch (e) {
                console.log(e)
            }
        },
        async goToDetails(row, isEdit = true) {
            this.$emit('typeChange', 'details', row, isEdit)
        },
        handleTableChange(pagination) {
            this.pagination.current = pagination.current
            this.pagination.pageSize = pagination.pageSize
            this.getTableData()
        },
        openModal(record) {
            this.currRow = record
            this.isShowModal = true
        },
        del(id) {
            selfEvaluationApi.del({ id }).then(() => {
                this.$message.success('删除成功')
                this.pagination.current = getFinalPageNum(
                    this.pagination.total,
                    this.pagination.current,
                    this.pagination.pageSize,
                    1,
                )
                this.getTableData()
            })
        },
        reset() {
            for (let key in this.searchParams) {
                this.searchParams[key] = null
            }
            this.searchTable()
        },

        searchTable() {
            clearTimeout(this._inputSearchTimer)
            this._inputSearchTimer = setTimeout(() => {
                this.pagination.current = 1
                this.getTableData()
            }, 600)
        },
        getTableData() {
            const { current: pageNum, pageSize } = this.pagination
            const { name, applyYear, evaluationDate } = this.searchParams
            this.tableLoading = true
            const params = { pageSize, pageNum, name, applyYear, evaluationDate }
            selfEvaluationApi.list(params).then(res => {
                if (res.code == 200) {
                    res = res.data
                    this.tableData = res.list
                    this.tableLoading = false
                    this.pagination.total = res.rowCount
                }
            })
        },
    },
}
</script>

<style lang="scss" scoped>
/deep/.index-search-form-model .ant-form-item {
    margin-bottom: 0 !important;
}
</style>
